<!--
 * @description: 
 * @Date: 2024-05-21 17:15:59
 * @example: 
 * @params: 
-->
<template>

  
  <div class="iframe">
    <Spin size="large" v-if="loading"></Spin>
    <iframe
      ref="Iframe"
      src="http://47.106.237.118:90/#/three-3d-map"
      style="width:100%;"
      frameborder="0"
      scrolling="no"
    ></iframe>
  </div>

</template>
<script>
import { mapActions } from "vuex";
import img from "@/assets/images/main.jpg";

export default {
name: "lorawan",
data() {
  return {
    loading: true, //默认不显示loading
    img: img
  };
},
methods: {
  ...mapActions([]),
  iframeLoad() {
    this.loading = true;
    const iframe = this.$refs.Iframe;

      iframe.onload = () => {
        this.loading = false;
      };

  },
},
mounted() {
  this.iframeLoad();
}
};
</script>

<style scoped>
.iframe {
height: 100%;
position: relative;
iframe {
  height: 100%;
}
}
</style>